import React, { Component } from 'react'
import "../../asset/css/reg.css"
import Header from "./component/DefaultHeader"
export default class register extends Component {
    state = {
        phone: "",
        nickname: "",
        password: ""
    }
    submit() {
        const {phone, nickname, password}=this.state
        if(phone===""){
            return alert("手机号不可以为空")
        }
        if(nickname===""){
            return alert("昵称不可以为空")
        }
        if(password===""){
            return alert("密码不可以为空")
        }
        this.$axios.post("/register", { phone, nickname, password }).then(res => {
            if (res.code === 200) {
                this.setState({
                    phone: "",
                    nickname: "",
                    password: ""
                })
                alert("注册成功")
            }else{
                alert("注册失败")
            }
        })
        this.props.history.push("/login")
    }
    render() {
        const { phone, nickname, password } = this.state
        return (
            <div className="reg-container">
                <Header title="会员注册" right_text="登录" right_method={()=>this.props.history.push("/login")}/>
                <div className="logo"></div>
                <div className="form">
                    <div className="form-group">
                        <input value={phone} type="text" placeholder="手机号" onChange={(e) => this.setState({ phone: e.target.value.trim() })} />
                    </div>
                    <div className="form-group">
                        <input value={nickname} type="text" placeholder="昵称" onChange={(e) => this.setState({ nickname: e.target.value.trim() })} />
                    </div>
                    <div className="form-group">
                        <input value={password} type="password" placeholder="密码" onChange={(e) => this.setState({ password: e.target.value.trim() })} />
                    </div>
                    <div className="form-group">
                        <button className="btn-gray" onClick={() => this.submit()}>注册</button>
                    </div>
                </div>
            </div>
        )
    }
}
